var app = getApp();
// pages/jok/jok.js
Page({

  /**
   * 页面的初始数据
   */
  data: {
    page:1,//第几页
    list:[],//笑话数据列表
    outflow:100,
    isShow:false,//是否显示
  },
  goa(){
    wx.navigateTo({
      url: '/pages/todo/todo',
    })
  },
  gob(){
    wx.redirectTo({
      url: '/pages/home/home',
    })
  },
  /**
   * @ params type {number} 1  请求的类型 1触底刷新，2下拉刷新
   */
  getJoks(type=1){
    // 用that变量缓存this
    var  that = this;
    wx.request({
      url: 'http://dida100.com/mi/list.php?page='+that.data.page,
      method:'GET',
      success(res){
      
        var list = that.data.list;
        // 更新数据list
        if(type==1){ //触底刷新，新的数据就应该加载在后面
          list = list.concat(res.data.result);
          // 加载提示
        
        }else{
          wx.showToast({
            title: '新加载'+res.data.result.length+'条笑话',
          })
          list = res.data.result.concat(list);
        }
        // list更新与页面数据更新
        that.setData({list,page:that.data.page+1})
        
      },
      complete(){
          // 停止下拉刷新
          wx.stopPullDownRefresh()
      }

    })
  },
 
  /**
   * 生命周期函数--监听页面加载
   */
  onLoad(options) {   
    var list = wx.getStorageSync('list')||[];
    var page = wx.getStorageSync('page')||1;
    // 获取page和list数据并更新
    this.setData({list,page})
    this.getJoks();
    this.watch("page",(nval,value)=>{
      console.log("数据page从",value,"变化为",nval);
    })
    this.watch("list",(nval,value)=>{
      console.log("数据list从",value,"变化为",nval);
      // 存储page也list数据
      wx.setStorageSync('list', nval)
      wx.setStorageSync('page', this.data.page)
    })
  }, 
// list发生变化时候存储list到本地，同时存储page
// 页面挂载后从本地存储获取list与page
// 实现监听list的变化，page的变化 存储
// Object.defineProperty set与get监听
watch(key,handler){
  var self = this; //存储本地的this
  var value = self.data[key];//获取到key对应的值
  var data = self.data;// 获取需要被监听的数据
  // 监听data的变化 执行handler
  // 在Object.defineProterty对data的key属性进行配置，获取key属性 data[key] 会执行get方法
  // 如果设置key属性 data[key]===xxx 触发 set方法  nval就是复制 xxx
  Object.defineProperty(data,key,{
    get(){return value},
    set(nval){
      if(nval===value){return}
      // key的值发生变化时候 执行handler
      // self就是handler被执行时候指定的this
      // nval key对应的最新值，oval之前的值
      handler.call(self,nval,value)
      value = nval;//更新value的值
    }
  })
},

  /**
   * 生命周期函数--监听页面初次渲染完成
   */
  onReady() {

  },

  /**
   * 生命周期函数--监听页面显示
   */
  onShow() {
    app.globalData.outflow = app.globalData.outflow-1;
    this.setData({outflow:app.globalData.outflow})
  },

  /**
   * 生命周期函数--监听页面隐藏
   */
  onHide() {

  },

  /**
   * 生命周期函数--监听页面卸载
   */
  onUnload() {

  },

  /**
   * 页面相关事件处理函数--监听用户下拉动作
   */
  onPullDownRefresh() {
    this.getJoks(2)
  },

  /**
   * 页面上拉触底事件的处理函数
   */
  onReachBottom() {
      this.getJoks()
  },

  /**
   * 用户点击右上角分享
   */
  onShareAppMessage() {
    return {
      title:"送你一个现金红包",
      // path:"/pages/home/home",
      imageUrl:"https://img2.baidu.com/it/u=2830708319,1889372955&fm=253&fmt=auto&app=138&f=JPEG?w=500&h=701"
    }
  },
  // 分享朋友圈
  onShareTimeline(){

  },
  // 添加收藏
  onAddToFavorites(){},
  // 滚动监听
  onPageScroll(e){
    if(e.scrollTop>300){
      this.setData({isShow:true})
    }else{
      this.setData({isShow:false})
    }
  },
  // 回到顶部
  goTop(){
    // 滚动到底部 时间300毫秒，位置0
    wx.pageScrollTo({
      duration: 300,
      scrollTop:0
    })
  }
   
})